<template>
  <div class="baseDialog">
    <div>
      <el-drawer ref="drawer" :title="$t('mesTechnology.selectSeries')" :visible.sync="drawer" direction="rtl" size="60%"
        :before-close="handleClose">
        <ele-page :key="drawer" v-loading="loading" :formConfig="searchConfig" ref="eleTable" :operateList="operateList"
          @handleOperateEvent="handleOperateEvent" @row-dblclick="getSelectMesTechnology" :column="column"
          :getList="getList" uniqueId="mesTechnologyTable">
        </ele-page>
      </el-drawer>
    </div>
  </div>
</template>

<script>
import {
  getSeriesList as getList
} from '@/api/process/mesProcessMaterial'

export default {
  name: 'SeriesDialog',
  data() {
    return {
      title: null,
      drawer: false,
      isLoading: false,
      loading: false,
      searchConfig: {
        inline: true,
        formDesc: {
          seriesCode: {
            type: 'input',
            layout: 12,
            label: $i18n.t('mesTechnology.seriesCoding')
          },
          seriesName: {
            type: 'input',
            layout: 12,
            label: $i18n.t('mesTechnology.seriesName')
          }
        }
      },
      operateList: [
        {
          name: $i18n.t('common.cancel'),
          handleName: 'cls' //点击时返回的标识
        },
        {
          name: $i18n.t('mesTechnology.confirmAdd'),
          type: 'success',
          icon: 'el-icon-success',
          handleName: 'add', //点击时返回的标识
          isMultiple: true, //至少选择一条
          //是否可点击；
          disabled: (data) => {
            return data.length != 1
          }
        }
      ],
      getList,
      column: [
        {
          type: 'selection'
        },
        {
          type: 'index',
          label: $i18n.t('common.order'),
          width: 60
        },
        {
          prop: 'seriesCode',
          label: $i18n.t('mesTechnology.seriesCoding'),
          width: 120,
          showOverflowTooltip: true
        },
        {
          prop: 'seriesName',
          label: $i18n.t('mesTechnology.seriesName'),
          width: 150,
          showOverflowTooltip: true
        },
      ],
    }
  },
  computed: {},
  methods: {
    cancelForm(bool) {
      this.drawer = bool
    },
    handleClose(done) {
      done()
      // this.$confirm($i18n.t('mesTechnology.sureClose'))
      //   .then((_) => {
      //     done()
      //   })
      //   .catch((_) => { })
    },
    //表格顶部按钮操作事件
    handleOperateEvent(data) {
      this.title = data.name
      const fnc = {
        // 查询
        search: () => { },
        //   取消
        cls: () => {
          this.cancelForm(false)
        },
        // 确认
        add: () => {
          if (data.rows.length == 1) {
            this.$emit('response', data.rows)
            this.cancelForm(false)
          } else {
            this.$message.warning($i18n.t('common.single'))
          }
        }
      }
      fnc[data.handleName]()
    },

    //刷新表格数据
    refresh(isReset = true) {
      this.$refs.eleTable.refresh(isReset)
    },

    // 弹框表格，双击表格，或者点击确定 返回选中数据
    getSelectMesTechnology(data) {
      var li = [];
      li[0] = data

      this.$emit('response', li)
      this.cancelForm(false)
    }
  }
}
</script>
<style lang="scss" scoped>
.baseDialog {
  /deep/.el-drawer__body {
    padding: 0 10px;
  }
  /deep/ .ele-form-search {
    height: auto!important;
  }
}
</style>
